@import "Colors.css";

input[type="checkbox"].hw-chk {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}

input[type="checkbox"].hw-chk + label::before {
    content: '\a0'; /* 不换行空格 */
    display: inline-block;
    vertical-align: .2em;
    width: .8em;
    height: .8em;
    margin-right: .2em;
    border-radius: .2em;
    background: silver;
    text-indent: .15em;
    line-height: .55;
    box-shadow: 1px 1px rgba(0,0,0,0.5);
}

input[type="checkbox"].hw-chk:checked + label::before {
    content: '\2713';
    background: var(--c8);
}

input[type="checkbox"].hw-chk:focus + label::before {
    box-shadow: 0 0 .1em .1em var(--c6);
}

input[type="checkbox"].hw-chk:disabled + label::before {
    background: gray;
    box-shadow: none;
    color: #555;
}
